<extend name="common:base" />
<block name="content">
   <div id="header">
        <div class="header">
            <h1 class="tit">商品列表</h1>
            <!--<p class="goback">-->
                <!--<a class="return" href="javascript:history.go(-1);">返回</a>-->
                <!--&lt;!&ndash;<a class="close" href="#"></a>&ndash;&gt;-->
            <!--</p>-->
            <!--<p class="more"><a class="share"></a></p>-->
        </div>
    </div>


    <div class="kinds-content">

        <!-- 左边商品目录 -->
        <ul class="kinds-lidt">
            <volist name="categories" id="vo">
                <if condition="$i eq 1">
                    <li class="cate kinds-bg" data-id="{$vo['id']}">{$vo['c_name']}</li>
                <else/>
                    <li class="cate" data-id="{$vo['id']}">{$vo['c_name']}</li>
                </if>
            </volist>
        </ul>


        <!-- 右边全部商品 -->
        <div class="goods-content">

            <div class="fl-a">

                    <input type="hidden" value="{$cate_id}" id="cate_id">
                    <div class="fl-search">
                        <img src="./Application/Home/View/Default/Static/img/searchs.jpg">
                        <input type="search" name="mName" class="fl-soushu" placeholder="请输入你要的商品" id="mName">
                    </div>
            </div>

            <!-- 对应分组商品 -->
            <ul class="goods-list">
                <notempty name="good">
                    <volist name="good" id="vo">
                        <li>
                            <div class="goods-list-pic">
                                <a href="{:U('Good/goodsdetail', array('id'=>$vo['id']))}">
                                    <img src="{$vo['thumb']}"/>
                                </a>
                            </div>
                            <div class="goods-list-msg">
                                <span class="goods-list-name">{$vo['g_name']}</span>
                                <span class="goods-list-price">￥{$vo['price']}</span>
                                <a class="goods-list-car" href="javascript:;" g_id="{$vo['id']}"></a>
                            </div>
                        </li>
                    </volist>
                <else />
                    <div class="no_data">
                        <img src="./Application/Home/View/Default/Static/img/no_data.png" class="tip_img">
                    </div>
                </notempty>
            </ul>
        </div>


    </div>
<div class="footer">
    <ul class="footer-tab">
        <li>
            <a href="{:U('Index/index', array('shop_id'=>session('url_shop_id')))}">
                <i class="foot_bg"></i>
                <span>首页</span>
            </a>
        </li>
        <li>
            <a href="{:U('Good/cate')}">
                <i class="foot_bg1 foot-this"></i>
                <span>分类</span>
            </a>
        </li>
        <li>
            <a href="{:U('GoodShopcart/shopcart')}">
                <i class="foot_bg2"></i>
                <span>购物车</span>
            </a>
        </li>
        <li>
            <a href="{:U('Setting/personal')}">
                <i class="foot_bg3"></i>
                <span>我的</span>
            </a>
        </li>
    </ul>
</div>
</block>

<block name="CSS">
    <link rel="stylesheet" href="{:C('__STATIC__')}{$theme}/Static/{:C('css')}/kinds.css" />


</block>

<block name="JS">
    <script type="text/javascript">
    
        function ajax_good() {
                $.ajax({
                    url: "{:U('Good/cate')}",
                    type: 'post',
                    data: {
                        m_name: $('#mName').val(),
                        cate_id: $('#cate_id').val()
                    },
                    beforeSend: function() {
                        layer.msg('正在加载中..', {time:0, icon:16});
                    },
                    success: function(data) {
                        layer.closeAll();
                        $('.goods-list').html('');
                        $('.goods-list').append(data);
                    }
                });
        }
    
    
    
    
        $(function() {
            
            //回车的时候触发
            $(document).keyup(function(event){
              if(event.keyCode ==13) {
                  ajax_good();
              }
            });



            //搜索商品
            $('#mName').blur(function() {
                ajax_good();
            });


            //不同分类的商品
            $('.cate').click(function() {
                var cate_id = $(this).attr('data-id');
                $('.cate').removeClass('kinds-bg');
                $(this).addClass('kinds-bg');
                $.ajax({
                    url: "{:U('Good/cate')}",
                    type: 'post',
                    data: {
                        cate_id: cate_id
                    },
                    beforeSend: function() {
                        layer.msg('正在加载中..', {time:0, icon:16});
                    },
                    success: function(data) {
                        $('#cate_id').val(cate_id);
                        $('#mName').val('');
                        layer.closeAll();
                        $('.goods-list').html('');
                        $('.goods-list').append(data);
                    }
                });
            });

            //加入购物车
            $(document).on('click', '.goods-list-car', function() {
                $.ajax({
                    url:"{:U('GoodShopcart/addcart')}",
                    data: {
                        'good_id': $(this).attr('g_id'),
                        'num':1
                    },
                    type: 'post',
                    success: function (msg) {
                        if(msg == 1) {
                            layer.msg('添加购物车成功！', {icon: 1});
                        }else if(msg == -1){
                            layer.msg("商品信息不存在",{icon:2});
                        }else if(msg == -2){
                            layer.msg("商品数量错误",{icon:2});
                        }else if(msg == -3){
                            layer.msg("商品状态错误",{icon:2});
                        }else if(msg == -4){
                            layer.msg("规格信息错误",{icon:2});
                        }
                    }
                });
            });

        });
    </script>
</block>
